//修改同步库存弹窗提示
import { useState, useEffect } from "react";
import CommonModal from "@/components/CommonModal";
import { Form, Radio } from "antd";
import CommonLoading from "@/components/CommonLoading";
import { isEmpty } from "lodash";

const InventoryTipModal = ({ visible, inventoryType, item, handleCancel, handleOk }) => {
	const [loading, setloading] = useState(false);

	const [form] = Form.useForm();

	useEffect(() => {
		if (visible) {
			form.resetFields();
		}
	}, [visible]);

	const onFinish = () => {
		form
			.validateFields()
			.then(val => {
				handleOk(val);
			})
			.catch(err => {});
	};

	return (
		<CommonModal
			zIndex={1100}
			minHeight="100px"
			title={"提示"}
			visible={visible}
			onCancel={handleCancel}
			onOk={onFinish}
			width="494px"
		>
			{inventoryType ? (
				<>
					<p>
						请选择需要同步的库存，该操作会使该店铺下已禁止的所有商品开启，已开启的<span className="common-color9">不会</span>
						更改状态和库存类型，请谨慎操作
					</p>
					<Form
						name="create-group"
						onFinish={onFinish}
						autoComplete="off"
						layout="horizontal"
						labelAlign="right"
						form={form}
						initialValues={{
							syncStockType: !isEmpty(item) ? item.syncStockType : undefined
						}}
					>
						<Form.Item name="syncStockType" rules={[{ required: true, message: "请输入分组名称" }]} style={{ marginTop: 16 }}>
							<Radio.Group>
								<Radio value={1}>可用库存</Radio>
								<Radio value={2}>虚拟库存</Radio>
							</Radio.Group>
						</Form.Item>
					</Form>
				</>
			) : (
				<p>确定禁止库存同步？该操作会使店铺下已开启库存同步的所有商品禁止同步库存，请谨慎操作</p>
			)}
			<CommonLoading loading={loading} />
		</CommonModal>
	);
};

export default InventoryTipModal;
